// 项目全局指令

// 1.给元素自动添加边框

// 演示：定义一个全局指令 => 所有页面都可以使用
// xue指令的作用：操作DOM（html）
// 1. 语法：Vue.directive('指令名', {指令执行的逻辑})
// 2. 使用：v-指令名="data变量"
export const border = {
  // dom 使用指令的dom元素
  // options 指令选项 => 接收指定的变量值：options.value
  inserted(dom, options) {
    console.log('指令参数', dom, options)
    dom.style.border = `10px solid ${options.value}`
  }
}

// 2. 处理图片加载失败，显示默认图片
export const imgError = {
  inserted(dom, options) {
    dom.onerror = () => {
      // 图片加载失败执行
      dom.src = options.value
    }
  }
}
